import Vue from 'vue'
import App from './App.vue'
import router from "./router"
import store from "./store"
// 引入element-ui
import ElementUI from "element-ui"
import "element-ui/lib/theme-chalk/index.css"
// 引入自定义图标样式
import "@/assets/css/index.css"
import "@/assets/css/iconfont.css"
// 引入自定义配置文件
import config from './assets/js/config'
// 引入axios
import axios from "axios"
import VueAxios from "vue-axios"
// 引入echarts图表组件
import Echarts from "vue-echarts"
import "echarts/lib/chart/line"
import "echarts/lib/chart/pie"
import "echarts/lib/chart/bar"
import "echarts/lib/chart/map"
import "echarts/lib/component/toolbox"
import "echarts/lib/component/legend"
import "echarts/lib/component/title"
//引入Markdown编辑工具组件
import mavonEditor from "mavon-editor"
import "mavon-editor/dist/css/index.css"
// 引入进度条插件：这是一个类似youtube、Medium等网站上的小进度条插件。
import NPrpgress from "nprogress"
import "nprogress/nprogress.css"
//类似github代码提交代码活跃图vue组件
import VueCalendarHeatmap from "vue-calendar-heatmap"
//引入day.js
//Day.js 是一个轻量的处理时间和日期的 JavaScript 库
//和 Moment.js 的 API 设计保持完全一样。
import dayjs from "dayjs"
//引入Vue标签云UI组件
import tagCloud from "@/components/tag-cloud"

Vue.prototype.config = config
Vue.use(mavonEditor)
Vue.use(tagCloud)
Vue.use(VueCalendarHeatmap)
Vue.component("v-chart", Echarts)
Vue.use(VueAxios, axios)
Vue.use(ElementUI)
Vue.config.productionTip = false
Vue.prototype.$moment = dayjs

Vue.filter("date", function(value, formatStr = "YYYY-MM-DD"){
  return dayjs(value).format(formatStr)
})

Vue.filter("dateTime", function(value, formatStr = "YYYY-MM-DD HH:mm:ss"){
  return dayjs(value).format(formatStr)
})

NPrpgress.configure({
  easing:"ease", //动画方式
  speed:500, //递增进度条的速度
  showSpinner: true, //是否显示加载ico
  trickleSpeed: 200, //自动递增间隔
  minimum:0.3 //初始化时的最小百分比
})

router.beforeEach((to, from, next) => {
  NPrpgress.start()
  if(to.path == "/login"){
    next();
  } else if(!store.state.userId){
    next({path:"/login"})
  } else{
    next()
  }
})

router.afterEach(() => {
  NPrpgress.done()
})

// 响应拦截器
axios.interceptors.response.use(
  function(response){
    switch (response.data.code){
      case 40001:
        Vue.prototype.$message({
          type:"error",
          message: response.data.message
        });
        router.push({path:"/login"});
        break;
        case 50000:
          Vue.prototype.$message({
            type:"error",
            message:response.data.message
          });
          break;
    }
    return response;
  },
  function(error){
    return Promise.reject(error);
  }
);

new Vue({
  router,
  store,
  render: h => h(App),
}).$mount('#app')
